<template>
  <el-form-item :label="label" :prop="prop">
    <el-input
      v-model="newv"
      :placeholder="placeholder"
      :show-password="showPassword"
      :disabled="disabled"
      :maxlength="maxlength"
      :formatter="formatCurrency"
      :parser="parseCurrency"
    />
  </el-form-item>
</template>
<script setup>
import { computed } from 'vue';

const props = defineProps({
  modelValue: [String, Number],
  label: {
    type: String,
    default: "",
  },
  prop: {
    type: String,
    default: "",
  },
  placeholder: {
    type: String,
    default: "请输入",
  },
  showPassword: [Boolean],
  disabled: {
    type: Boolean,
    default: false,
  },
  maxlength: {
    type: Number,
    default: null,
  },
});
const emit = defineEmits(["update:modelValue"]);

const newv = computed({
  get() {
    return props.modelValue;
  },
  set(value) {
    emit("update:modelValue", value);
  },
});
// 格式化函数
const formatCurrency = (value) => {
  if (!value) return '';
  return `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
};

// 解析函数
const parseCurrency = (value) => {
  return value.replace(/\$\s?|(,*)/g, '');
};
</script>
